<div class="addresses tx5 gutterV">
  <%
    let addressIndex = -1;
    ob.addresses.forEach((addressRow, index) => {
  %>
    <div class="flexRow gutterH">
    <%
       addressRow.forEach((address, index) => {
        addressIndex += 1;
    %>
      <div class="col6">
        <div class="addressBox border clrP clrBr">
          <span class="txB"><%= `${address.name}${address.company ? '<br />' : ''}` %></span>
          <%= `${address.company}${address.addressLineOne ? '<br />' : ''}` %>
          <%= `${address.addressLineOne}${address.addressLineTwo ? ` ${address.addressLineTwo}` : ''}${address.city ? '<br />' : ''}` %>
          <%= `${address.city}${address.state ? `, ${address.state}` : ''}${address.postalCode ? ` ${address.postalCode}` : ''}${address.country ? '<br />' : ''}` %>
          <%= `${ob.polyT(`countries.${address.country}`)}${address.addressNotes ? '<br />' : ''}` %>
          <% if (address.addressNotes) print(`<p class="notes">${address.addressNotes}</p>`) %>
          <a class="btn clrP clrBr clrSh2 js-delete" data-address-index="<%= addressIndex %>"><%= ob.polyT('settings.addressesTab.btnDelete') %></a>
        </div>
      </div>
     <% }); %>
    </div>
  <% }) %>
</div>
